@import '../_commont/reset.scss';

#slides {
    position:relative;
    margin:0 auto;
    overflow:hidden;
}
#slides .slides_container, #slides .tab-pannel img {
    width:1200px;
    height:320px;
    overflow:hidden
}
#slides .slides_container{
    position: relative;
}
#list li {
position: absolute;
left: 0;
left: 0;
opacity: 0;
transition: opacity 1s ease-in;
background: #ddd;
height:320px;
}
#list li.block {
opacity: 1;
}
/* 容器==============end============== */

/* banner左右button=========start============= */
#btn .next, #btn .prev {
    position:absolute;
    top:50%;
    margin-top:-32px;
    width:56px;
    height:64px;
    display:block;
    z-index:101;
    background:rgba(0, 0, 0, .5);
}
#btn a.prev {
left: 0;
}
#btn a.next {
right: 0;
}
/* 尖角符号 ------------------ */
#btn .next .arrow, #btn .prev .arrow {
    position:absolute;
    right:24px;
    top:50%;
    display:inline-block;
    content:"";
    width:18px;
    height:18px;
    border:solid #fff;
    border-width:2px 2px 0 0;
    -webkit-transform:translate(0, -50%) rotate(45deg);
    transform:translate(0, -50%) rotate(45deg)
}
#btn .prev .arrow.left {
    left:24px;
    -webkit-transform:translate(0, -50%) rotate(-135deg);
    transform:translate(0, -50%) rotate(-135deg)
}
/* 尖角符号 -------end----------- */
#btn .next:hover, #btn .prev:hover {
    background:rgba(255, 18, 104, .5)
}
/* banner左右button===========end===================== */
#slides .nav {
    position:absolute;
    right:32px;
    bottom:23px;
    z-index:99;
    cursor: pointer;
}

#option li {
width:10px;
height:10px;
display:inline-block;
margin-left:10px;
border-radius: 50%;
background: #fff;
opacity:.32;
}

#option li.active {
opacity:1;
}
